qtre.ui = {

	
}

qtre.ui.widget = function(){

	this.target = {};
}

qtre.ui.widget.prototype = {

	bindParam : function(material, param){
		if(material.name){
			this.target[material.name] = {
				"material" : material,
				"param" : param
			}
		}
	},

	unbindParam : function(material){
		delete this.target[material.name]
	},

	put : function(value){
		for(var name in this.target){
			var material = this.target[name].material;
			var param = this.target[name].param;
			
			var params = [];
			params[param] = value;

			material.updateUniforms(params);
		}
	},
	
	get : function(){
		//if there are multiple targets
		//return the first target, since we suppose
		//all the target has the same param value
		for(var name in this.target){
			var param = this.target[name].param;
			break;
		}
	}
	
}
/***********************************
 * slider - inherit from widget
 ***********************************/
qtre.ui.slider = function(option){

	this.min = option.min || 0;
	this.max = option.max || 100;
	this.value = option.value || 0;
	this.step = option.step || 1;

	qtre.ui.widget.call(this);

	var that = this;
	//we use jquery ui to create the slider
	//the instance is a jquery object which can
	//be appended
	this.instance = $("<div></div>").slider({
		"min" : this.min,
		"max" : this.max,
		"value" : this.value,
		"step" : this.step,
		"slide" : function(event, ui){
			if(qtre.core.isset(option.slide)){
				if(!option.slide.call(that, event, ui)){
					//not put the value when the callback function
					//return false
					return false;
				}
			}
			if(qtre.core.isset(ui.value)){
				that.value = ui.value;
				that.put(ui.value);
			}
		}
	})
}
qtre.ui.slider.prototype = new qtre.ui.widget();

/***********************************
 *  - inherit from widget
 ***********************************/